import MyIcon from '@/components/MyIcon';
import { getKeyRouter, removeDateHmsStr, tooltipLength } from '@/utils';
import { Empty, List, Spin, Tooltip, message } from 'antd';
import pageStyles from '@/common/pageLayout.less';
import { history } from 'umi';
import { useState } from 'react';
import { getMcontractByIDService } from '../services';
import InfiniteScroll from 'react-infinite-scroller';
import { ContractHomesAPI } from '../common/type';

export const ContractHomeCheckPane: React.FC<ContractHomesAPI.IContractHomeCheckPane> = ({
  styleClassName,
  contractInfoList,
  scrollObj,
  setScrollObj,
  defaultTaskCheckData,
}) => {
  /** 保存变更合同ID */
  const [modifyInfoDetail, setModifyInfoDetail] = useState<Record<string, any>>({});

  /** 获取详情 */
  const { getMcontractByIDRun, getMcontractByIDLoading } = getMcontractByIDService((res: any) => {
    if (res && res?.msgFlag) {
      history.push({
        pathname: `/contractController/getMcontractByID/:${getKeyRouter()}${getKeyRouter()}`,
        state: {
          pageType: 'detail',
          id: modifyInfoDetail?.clickType ? modifyInfoDetail?.pID : modifyInfoDetail?.busi_id,
          pageInfo: {
            pID: modifyInfoDetail?.busi_pID ? modifyInfoDetail?.busi_pID : null,
            id: modifyInfoDetail?.busi_id ? modifyInfoDetail?.busi_id : null,
          },
          pIDDetailInfo: {
            ...res?.obj,
          },
        },
      });
      setModifyInfoDetail({});
    } else {
      message.error(res?.msg);
    }
  });

  /** 点击跳转 */
  const onHandleSkip = (resObj) => {
    if (resObj?.attributes.busi_changeWay == 0 || resObj?.attributes.busi_changeWay == 1) {
      setModifyInfoDetail(resObj?.attributes);
      getMcontractByIDRun({
        id: resObj?.attributes.busi_pID,
      });
    } else {
      history.push({
        pathname: `/contractController/getMcontractByID/:${getKeyRouter()}${getKeyRouter()}`,
        state: {
          pageType: 'detail',
          id: resObj?.attributes.busi_id,
          pageInfo: {
            pID: resObj?.attributes?.busi_pID ? resObj?.attributes?.busi_pID : null,
            id: resObj?.attributes?.busi_id ? resObj?.attributes?.busi_id : null,
          },
          pIDDetailInfo: {
            ...resObj?.attributes,
            id: resObj?.attributes?.busi_id ? resObj?.attributes?.busi_id : null,
            pID: resObj?.attributes?.busi_pID ? resObj?.attributes?.busi_pID : null,
            contractCode: resObj?.attributes?.busi_contractCode,
          },
        },
      });
    }
  };

  /**  处理滚动加载 */
  const handleInfiniteOnLoad = () => {
    const { total } = scrollObj;
    if (contractInfoList?.length >= total) {
      message.warning('没有更多数据了哦');
      setScrollObj({
        // ...scrollObj,
        total: 0,
        count: 0,
        limit: 10,
        hasMore: false,
        loading: false,
      });
      return;
    }
    defaultTaskCheckData(false);
  };

  return (
    <Spin spinning={getMcontractByIDLoading}>
      <div className="commonTabsBodyDom" style={{ padding: '5px 0px' }}>
        {contractInfoList && contractInfoList?.length > 0 ? (
          <div className={pageStyles['InfiniteScrollView']} style={{ padding: '0px 5px' }}>
            <InfiniteScroll
              loadMore={handleInfiniteOnLoad}
              initialLoad={false}
              pageStart={1}
              useWindow={false}
              hasMore={!scrollObj?.loading && scrollObj?.hasMore}
            >
              <List
                itemLayout="horizontal"
                dataSource={contractInfoList}
                className={`${styleClassName}-homeListSty`}
                renderItem={(item) => {
                  return (
                    <List.Item
                      onClick={() => {
                        onHandleSkip(item);
                      }}
                    >
                      <List.Item.Meta
                        avatar={
                          <div>
                            <MyIcon type="icon-hetongguanli1" style={{ fontSize: '40px' }} />
                          </div>
                        }
                        title={
                          <Tooltip placement="topLeft" title={tooltipLength(item?.attributes?.busi_contractName, 50)}>
                            <div className={`${styleClassName}-homeListSty-titleDiv`}>
                              <a className={pageStyles['over-flow-hidden']}>{item?.attributes?.busi_contractName || '--'}</a>
                              <div style={{ whiteSpace: 'nowrap', marginLeft: 10 }}>
                                {item?.attributes?.busi_createTime ? removeDateHmsStr(item?.attributes?.busi_createTime) : '--'}
                              </div>
                            </div>
                          </Tooltip>
                        }
                        description={
                          <Tooltip placement="topLeft" title={tooltipLength(item?.attributes?.busi_contractInfo, 50)}>
                            <div className={pageStyles['over-flow-hidden']}>{item?.attributes?.busi_contractInfo || '--'}</div>
                          </Tooltip>
                        }
                      />
                    </List.Item>
                  );
                }}
              />
            </InfiniteScroll>
          </div>
        ) : (
          <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />
        )}
      </div>
    </Spin>
  );
};
